<template>
	<v-menu :menu-position="menuPosition" :menu-items="menuItems" v-model:model-value="activeMenuId" :is-slide="true" slide-axis="y">
		<template #content-0>
			<text>自定义菜单一内容</text>
			<view>其他内容...</view>
		</template>

		<template #content-1>
			<view class="custom-content">
				<text>自定义菜单二内容</text>
				<v-button @click="handleClick">操作按钮</v-button>
			</view>
		</template>
	</v-menu>
</template>

<script setup>
import { ref } from 'vue';

const menuPosition = ref('right');
const activeMenuId = ref('menu1');

const menuItems = ref([
	{ id: 'menu1', title: '菜单一' },
	{ id: 'menu2', title: '菜单二' },
	{ id: 'menu3', title: '菜单三' }
]);

const handleClick = () => {
	console.log('按钮点击');
};
</script>
